<template>
  <view class="login-modal" v-if="visible" @click="handleClose">
    <view class="modal-content" @click.stop>
      <view class="modal-header">
        <text class="modal-title">登录</text>
        <text class="modal-close" @click="handleClose">×</text>
      </view>
      
      <view class="login-content">
        <view class="logo-section">
          <image src="/static/logo.png" class="logo" mode="aspectFit"></image>
          <text class="app-desc">专业烟酒行情平台</text>
        </view>
        
        <view class="login-form">
          <!-- 微信一键登录 -->
          <button 
            class="wechat-login-btn" 
            open-type="getUserInfo"
            @getuserinfo="handleWechatLogin"
            :loading="loginLoading"
          >
            <image src="/static/wechat-icon.png" class="wechat-icon" mode="aspectFit"></image>
            <text class="login-text">微信一键登录</text>
          </button>
        </view>
        
        <!-- 用户协议 -->
        <view class="agreement">
          <text class="agreement-text">
            登录即表示同意
            <text class="agreement-link" @click="showUserAgreement">《用户协议》</text>
            和
            <text class="agreement-link" @click="showPrivacyPolicy">《隐私政策》</text>
          </text>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
/**
 * 登录弹窗组件
 * @author 王勇程 <laughskydragon@qq.com>
 */
import { wechatLogin } from '@/api/user'
import { checkUserStatus } from '@/api/user'

export default {
  name: 'LoginModal',
  
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  
  data() {
    return {
      loginLoading: false
    }
  },
  
  watch: {
    visible(newVal) {
      if (!newVal) {
        this.resetForm()
      }
    }
  },
  
  methods: {
    // 关闭弹窗
    handleClose() {
      this.$emit('close')
    },
    
    // 微信一键登录
    async handleWechatLogin(e) {
      if (this.loginLoading) return
      
      this.loginLoading = true
      
      try {
        // 获取微信登录code
        const loginRes = await this.getWechatLoginCode()
        
        // 调用登录接口
        const res = await wechatLogin({
          code: loginRes.code,
          inviter_id: uni.getStorageSync('pending_inviter_id') || '',
          userInfo: e.detail.userInfo,
          encryptedData: e.detail.encryptedData,
          iv: e.detail.iv
        })
        
        // OneBase标准返回格式处理
        // request工具函数已处理code=0的情况，直接返回data.data，即这里的res就是服务器返回的data数组
        if (Array.isArray(res) && res.length > 2) {
          const userData = res[2] // 获取实际的用户数据对象
          // 验证返回数据的完整性
          if (!userData.user_token) {
            throw new Error('登录返回数据异常：缺少用户令牌')
          }
          
          if (!userData.id) {
            throw new Error('登录返回数据异常：缺少用户信息')
          }
          
          // 保存用户信息和token
          await this.$store.dispatch('user/login', {
            userToken: userData.user_token,
            userInfo: userData
          })
          
          // 登录成功后检查用户状态
          await this.checkUserStatusAfterLogin(userData.user_token)
          
          // 登录成功
          uni.showToast({
            title: '登录成功',
            icon: 'success',
            duration: 1500
          })
          
          this.$emit('success', userData) // Emit success with the actual user data
          // 延迟关闭弹窗，确保toast显示完毕
          setTimeout(() => {
            this.handleClose()
          }, 1500)

          // 清理pending邀请码（已在注册或登录流程绑定）
          uni.removeStorageSync('pending_inviter_id')
        } else {
          // 处理业务错误，如果res不是预期的数组结构，或者长度不足
          throw new Error('登录失败，服务器返回数据格式异常')
        }
        
      } catch (error) {
        console.error('微信登录失败:', error)
        
        // 根据错误类型提供不同的提示
        let errorMessage = '登录失败，请重试'
        
        if (error.message) {
          if (error.message.includes('用户拒绝')) {
            errorMessage = '用户取消授权'
          } else if (error.message.includes('网络')) {
            errorMessage = '网络连接失败，请检查网络'
          } else if (error.message.includes('token') || error.message.includes('认证')) {
            errorMessage = '登录认证失败，请重试'
          } else {
            errorMessage = error.message
          }
        }
        
        uni.showToast({
          title: errorMessage,
          icon: 'none',
          duration: 2000
        })
        
        // 如果是认证相关错误，触发token错误处理
        if (error.message && (error.message.includes('token') || error.message.includes('认证'))) {
          this.$store.dispatch('user/handleTokenError')
        }
        
      } finally {
        this.loginLoading = false
      }
    },
    
    // 获取微信登录code
    getWechatLoginCode() {
      return new Promise((resolve, reject) => {
        uni.login({
          provider: 'weixin',
          success: resolve,
          fail: reject
        })
      })
    },
    
    // 登录成功后检查用户状态
    async checkUserStatusAfterLogin(userToken) {
      try {
        if (!userToken) {
          console.warn('用户状态检查：缺少用户令牌')
          return
        }
        
        const response = await checkUserStatus({
          user_token: userToken
        })
        
        // OneBase标准返回格式处理
        if (response && response.code === 0 && response.data) {
          // 更新用户信息到store
          await this.$store.dispatch('user/updateUserInfo', response.data)
          console.log('登录后用户状态检查完成，信息已更新')
          
          // 刷新token过期时间
          await this.$store.dispatch('user/refreshToken')
        } else {
          console.warn('用户状态检查返回异常:', response)
        }
      } catch (error) {
        console.error('登录后用户状态检查失败:', error)
        
        // 如果是认证相关错误，需要处理
        if (error.message && (error.message.includes('token') || error.message.includes('认证') || error.message.includes('登录'))) {
          console.warn('用户状态检查遇到认证错误，可能需要重新登录')
          // 不立即处理token错误，因为刚刚登录成功，可能是临时网络问题
        }
        
        // 不影响登录流程，只记录错误
      }
    },
    
    // 重置表单
    resetForm() {
      this.loginLoading = false
    },
    
    // 显示用户协议
    showUserAgreement() {
      uni.navigateTo({
        url: '/pages/agreement/agreement?type=user'
      })
    },
    
    // 显示隐私政策
    showPrivacyPolicy() {
      uni.navigateTo({
        url: '/pages/agreement/agreement?type=privacy'
      })
    }

  }
}
</script>

<style scoped>
.login-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.modal-content {
  background-color: #FFF;
  border-radius: 20rpx;
  padding: 40rpx;
  margin: 0 60rpx;
  max-width: 600rpx;
  width: 100%;
  box-shadow: 0 10rpx 30rpx rgba(0, 0, 0, 0.1);
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 40rpx;
}

.modal-title {
  font-size: 36rpx;
  font-weight: bold;
  color: #333;
}

.modal-close {
  font-size: 48rpx;
  color: #999;
  line-height: 1;
  cursor: pointer;
}

.login-content {
  text-align: center;
}

.logo-section {
  margin-bottom: 60rpx;
}

.logo {
  width: 120rpx;
  height: 120rpx;
  margin-bottom: 20rpx;
}

.app-name {
  display: block;
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 10rpx;
}

.app-desc {
  display: block;
  font-size: 24rpx;
  color: #666;
}

.login-form {
  margin-bottom: 40rpx;
}

.wechat-login-btn {
  width: 100%;
  height: 88rpx;
  background: linear-gradient(135deg, #07C160 0%, #00A854 100%);
  border-radius: 44rpx;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30rpx;
  box-shadow: 0 6rpx 20rpx rgba(7, 193, 96, 0.3);
}

.wechat-login-btn::after {
  border: none;
}

.wechat-icon {
  width: 40rpx;
  height: 40rpx;
  margin-right: 20rpx;
}

.login-text {
  font-size: 32rpx;
  color: #FFF;
  font-weight: 500;
}

.agreement {
  padding: 0 20rpx;
}

.agreement-text {
  font-size: 24rpx;
  color: #999;
  line-height: 1.5;
}

.agreement-link {
  color: #07C160;
  text-decoration: underline;
}
</style>
